<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<script type="text/javascript" src="../assets/vue.js"></script>
	<title>methods Option</title>
</head>
<body>
<h1>Mixins Option</h1>
<hr>
<div id="app">
	{{num}}
	<div>
		<button @click="add()">add</button>
		<button @click="sub()">sub</button>
	</div>
</div>

<script type="text/javascript">
	var addConsole = {
		updated:function () {
			console.log('数据发生变化'+this.num);
		}
	};

	Vue.mixin({
		updated:function () {
			console.log('全局的updated');
		}
	});

	var app=new Vue({
		el:'#app',
		data:{
			num:16,
		},
		methods:{
			add:function () {
				this.num++;
			},
			sub:function () {
				this.num--;
			}
		},
		updated:function () {
			console.log('构造器内的updated');
		},
		mixins:[addConsole]
	});
</script>
</body>
</html>